<template>
  <view class="padding">
    <view class="po-rela" style="margin-top: 50rpx">
      <view class="bg-white radius14" style="padding: 35rpx 25rpx; width: 694rpx">
        <view class="flex align-center">
          <image :src="info.doctor_avatar" style="width: 120rpx; height: 120rpx; border-radius: 50%; margin-top: -74rpx" mode="aspectFill"></image>
          <view class="col-333 font36 margin-top-xs padding-left-sm">
            <text class="text-bold">{{ info.doctor_name }}</text>
            <text class="margin-left-sm font26">{{ info.doctor_title }}</text>
          </view>
        </view>
        <view class="margin-top-sm" v-if="info.disease">
          <image src="https://wenzhen.jiangkukeji360.com/static/home/zysc.png" style="width: 103rpx; height: 25rpx; vertical-align: middle" mode=""></image>
          <text class="font24 col-666" style="padding-left: 16rpx; line-height: 36rpx">擅长：{{ info.disease }}</text>
        </view>
      </view>
    </view>
    <!-- 整体就医感受 -->
    <view class="margin-top-sm bg-white radius14" style="padding: 32rpx 36rpx">
      <view class="font30 col-333">整体就医感受</view>
      <view class="col-999 font24 margin-top-xs">您的反馈将帮助到更多病友，为病友指明求医路</view>
      <view class="margin-top-xs flex align-center">
        <view class="flex align-center">
          <image
            v-for="(item, index) in 5"
            :key="index"
            @click="ratelv = index + 1"
            :src="index < ratelv ? 'https://wenzhen.jiangkukeji360.com/static/home/xing1.png' : 'https://wenzhen.jiangkukeji360.com/static/home/xing0.png'"
            mode="widthFix"
            style="width: 32upx"
            class="margin-right-xs"
          ></image>
        </view>
      </view>
      <view class="col-333 font30" style="margin-top: 34rpx">
        给医生点赞
        <text class="col-999 font26">（最少10个字）</text>
      </view>
      <view class="margin-top" style="border: solid 1rpx #e8e8e8; border-radius: 12rpx; padding: 27rpx">
        <textarea placeholder="请输入评价" placeholder-class="placestype col-999" v-model="content" name="" id="" cols="30" rows="10"></textarea>
      </view>
    </view>
    <!-- 提交评价按钮 -->
    <view class="flex align-center justify-center foot-box margin-bottom">
      <view @click="submit" class="btnbg font30" style="width: 500rpx; height: 80rpx; background-color: #0087fe">提交评价</view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      ratelv: 1,
      info: {},
      content: '',
      orderid: ''
    };
  },
  onLoad(e) {
    e.id ? (this.id = e.id) : '';
    e.orderid ? (this.orderid = e.orderid) : '';
  },
  onShow() {
    this.getinfo();
  },
  methods: {
    getinfo() {
      this.util
        .request(
          'doctor/details',
          {
            doctor_id: this.id
          },
          'post'
        )
        .then((res) => {
          this.info = res;
        });
    },
    submit() {
      if (!this.content) {
        this.util.showToast('请输入评价内容');
        return false;
      }
      this.util
        .request(
          'order/evaluate',
          {
            order_id: this.orderid,
            star: this.ratelv,
            content: this.content
          },
          'post'
        )
        .then((res) => {
          this.util.showToast('评价成功', true);
        });
    }
  }
};
</script>

<style>
page {
  background-color: #f8f8f8;
}
</style>
